import formatPlayCount from "@/utils/fomatPlayCount";
import { fomatImgSize } from "@/utils/formatImgSize";
import React, { memo } from "react";
import { SongCoverWrapper } from "./style";

const SongCover = memo((props) => {
  const { item } = props;
  return (
    <SongCoverWrapper className="ShunCursor">
      <div className="top">
        <img src={fomatImgSize(item.picUrl, 140)} alt="" />
        {/* 小图标 */}
        <div className="covers">
          <div className="coverLeft">
            <div className="listen">
              <img src={require("@/assets/icons/听歌.png")} alt="" />
            </div>
            <div className="amountPlay">{formatPlayCount(item.playCount)}</div>
          </div>
          <div className="coverRight">
            <div className="playIcon">
              <img src={require("@/assets/icons/运行.png")} alt="" />
            </div>
          </div>
        </div>
      </div>
      <div className="bottom ShunEllipese">{item.name}</div>
    </SongCoverWrapper>
  );
});

export default SongCover;
